<script setup name="staffadd">
import OAMain from '@/components/OAMain.vue';
import { ref, onMounted } from 'vue'
import { useAuthStore } from '@/stores/auth.js';
import { ElMessage } from 'element-plus';
import staffHttp from '@/api/staffHttp';
import { useRouter } from 'vue-router';

let inform = ref({
    realname:"",
    email:"",
    password:""
})
const router = useRouter()
const authStore = useAuthStore()
const user = authStore.user
let department_name = user.department.intro || "无"
let leader_name = user.realname
const formRef = ref(null)

const rules = ref({
    realname: [{ required: true, message: "请输入员工姓名", trigger: 'blur' }],
    email: [{ required: true, message: "请输入员工邮箱", trigger: "blur" }],
    password: [{ required: true, message: "请填入密码", trigger: 'blur' }],
})

const onSubmit = () => {
    formRef.value.validate(async(valid,fields) => {
        if(valid){
            try{
                await staffHttp.addStaff(inform.value.realname,inform.value.email,inform.value.password)
                ElMessage.success("员工信息添加成功")
                router.push({name:"stafflist"})
            }catch(err){
                console.error('完整错误对象:', err)
                console.log('响应数据:', err.response?.data)
                ElMessage.error(err.response?.data?.message || err.message)
            }
        }
    })
}

onMounted(async () => {

})

</script>


<template>
    <OAMain title="新增员工">
        <el-card class="add_card">
        <el-form :model="inform" label-width="120px" :rules="rules" ref="formRef">
            <el-form-item label="姓名" prop="realname">
                <el-input v-model="inform.realname"  placeholder="请填写姓名"/>
            </el-form-item>
            <el-form-item label="邮箱" prop="email">
                <el-input v-model="inform.email"  placeholder="请填写邮箱"/>
            </el-form-item>
            <el-form-item label="密码" prop="password">
                <el-input v-model="inform.password"  placeholder="请填写初始密码"/>
            </el-form-item>
            <el-form-item label="部门">
                <el-input v-model="department_name" disabled />
            </el-form-item>
            <el-form-item label="领导">
                <el-input v-model="leader_name"  disabled />
            </el-form-item>
        </el-form>
        <div class="button">
            <el-button type="success" @click="onSubmit">提交</el-button>
        </div>
    </el-card>
    </OAMain>
</template>

<style scoped>
.add_card{
    margin-top: 30px;
}
.button{
    text-align: right;
    margin-right: 50px;
}
</style>